<template>
	<div class="case-slider">
		<ul class="coupons-group" v-if="couponsList&&couponsList.length>0" :style="foldSts? '':'max-height:none!important;'">
			<coupon-item v-for="item in couponsList" :key="item.coupIssueId" :item="item"/>
		</ul>
		<van-divider v-if="couponsList&&couponsList.length>3">
			<div @click="toggleCouponsFold">{{foldSts? '更多礼券':'收起展示'}} <van-icon :name="foldSts? 'arrow-down':'arrow-up'" class="mgl10"/></div>
		</van-divider>
	</div>
</template>
<style lang="scss" scoped>
.case-slider{
	.coupons-group{
		margin:10px 10px 0 10px;padding:0;display:block;max-height:200px;overflow:hidden;

	}
}


</style>
<script lang="ts" setup>
//店内领取式优惠券展示
//maxAcquireAmount 每个渠道最多可领多少张
//acquiredAmount 当前渠道已领多少张
//remainAmount表示该类优惠券还剩多少张，如果是店铺/管理员则不提供领取按钮及剩余展示（remainAmount为null），如果是游客则有领取按钮，不展示剩多少张（remainAmount为null）

const props = defineProps({
	shopId:{
		type:String,
		required:true,
	},
})
const foldSts=ref(true)

const couponsList = ref([
	{
		coupIssueId:'1111',
		couponAmount:100,
		activeType:1,activeDay:100,activeTime:'',inactiveTime:'',
		controlMsg:'全场通用',limitMsg:'满1000可用',couponTypeName:'国庆大酬宾100元券',
		remainAmount:500,acquiredAmount:0,maxAcquireAmount:3,
	},
	{
		coupIssueId:'2222',
		couponAmount:500,
		activeType:2, activeDay:0,activeTime:'2023.01.23',inactiveTime:'2023.12.23',
		controlMsg:'全场通用',limitMsg:'满5000可用',couponTypeName:'国庆大酬宾500元券',
		remainAmount:0,acquiredAmount:1,maxAcquireAmount:3,
	},
	{
		coupIssueId:'3333',
		couponAmount:5000,
		activeType:1,activeDay:100,activeTime:'',inactiveTime:'',
		controlMsg:'限华为品牌',limitMsg:'满50000可用',couponTypeName:'国庆大酬宾5000元券',
		remainAmount:500,acquiredAmount:1,maxAcquireAmount:3,
	},
	{
		coupIssueId:'4444',
		couponAmount:1000,
		activeType:2, activeDay:0,activeTime:'2023.01.23',inactiveTime:'2023.12.23',
		controlMsg:'限商品 iphone14, iphone13 mini, apple watch 8 series',limitMsg:'满10000可用',couponTypeName:'国庆大酬宾1000元券',
		remainAmount:10,acquiredAmount:1,maxAcquireAmount:5,
	},
	{
		coupIssueId:'5555',
		couponAmount:100,
		activeType:1,activeDay:100,activeTime:'',inactiveTime:'',
		controlMsg:'全场通用',limitMsg:'满1000可用',couponTypeName:'国庆大酬宾100元券',
		remainAmount:500,acquiredAmount:0,maxAcquireAmount:3,
	},
	{
		coupIssueId:'6666',
		couponAmount:500,
		activeType:2, activeDay:0,activeTime:'2023.01.23',inactiveTime:'2023.12.23',
		controlMsg:'全场通用',limitMsg:'满5000可用',couponTypeName:'国庆大酬宾500元券',
		remainAmount:0,acquiredAmount:1,maxAcquireAmount:3,
	},
	{
		coupIssueId:'7777',
		couponAmount:5000,
		activeType:1,activeDay:100,activeTime:'',inactiveTime:'',
		controlMsg:'限华为品牌',limitMsg:'满50000可用',couponTypeName:'国庆大酬宾5000元券',
		remainAmount:500,acquiredAmount:1,maxAcquireAmount:3,
	},
])

//methods
//展开、收起优惠券列表
const toggleCouponsFold =()=>{
	foldSts.value = !foldSts.value
	console.log('ddd',foldSts.value)
}
</script>